<template>
    
    <!-- 组件的模板 -->
    <div class="page">
        <div class="weui-cells">
            <a class="weui-cell weui-cell_access" href="javascript:;" @click="selectType">
                <div class="weui-cell__bd">
                    <p>导出类型</p>
                </div>
                <div class="weui-cell__ft">
                    <span class="placeholder" v-if="exportType == ''">请选择</span>{{exportType}}
                </div>
            </a>
            <a class="weui-cell weui-cell_access" href="javascript:;" @click="selectStartTime">
                <div class="weui-cell__bd">
                    <p>开始时间</p>
                </div>
                <div class="weui-cell__ft">
                    <span class="placeholder" v-if="start_date == ''">请选择</span>{{start_date}}
                </div>
            </a>
            <a class="weui-cell weui-cell_access" href="javascript:;" @click="selectEndTime">
                <div class="weui-cell__bd">
                    <p>结束时间</p>
                </div>
                <div class="weui-cell__ft">
                    <span class="placeholder" v-if="end_date == ''">请选择</span>{{end_date}}
                </div>
            </a>
        </div>
        <div class="weui-cells">
            <a class="weui-cell weui-cell_access" href="javascript:;" @click="selectTask">
                <div class="weui-cell__bd">
                    <p>考勤规则</p>
                </div>
                <div class="weui-cell__ft" v-if="isSingle">
                    <span class="placeholder" v-if="taskName == ''">请选择</span>{{taskName}}
                </div>
                <div class="weui-cell__ft" v-else>
                    <span class="placeholder" v-if="taskMultipleName.length == 0">请选择</span>
                    <span v-else>已选{{taskMultipleName.length}}个</span>
                </div>
            </a>
        </div>
        <div class="export_tips">
            <div class="tipText"><span>*</span>导出数据会通过消息通知发送给您，注意查收</div>
            <div class="tipText"><span>*</span>打卡明细表不支持选择多个考勤规则</div>
        </div>
        <div class="mod-btn-box">
            <a href="javascript:;" 
                class="weui-btn weui-btn_primary"
                :class="{'weui-btn_disabled': !isValidation}"
                @click="exportFn"
                >确认导出</a>
        </div>
    </div>
</template>

<script>
    /**
     *  引入工具类库 或 Native API
     *  example : import widget from 'gapi/widget'
     */
    import KCApiApp from 'clientApi/KCApiApp.js'
    import commonPage from 'clientApi/commonPage.js'
    import * as util from 'js/util.js'
    import widget from 'gapi/widget.js'
    import clientUi from 'gapi/clientUi.js'
    import cache from 'gapi/cache.js'
    import socialApi from 'clientApi/socialApi.js'
    /**
     *  引入组件 以及 组件接口(Action)
     *  example : import Somecomponents from 'components/Somecomponents/Somecomponents'
     */

    /**
     *  组件实例对象
     */
    export default {
        components: {

        },
        data: function(){
            return{
                startTime: util.getLocalTime(new Date().getTime(), 'yyyy-MM-dd'),
                endTime: util.getLocalTime(new Date().getTime(), 'yyyy-MM-dd'),
                startTimeCompatible: util.getLocalTime(new Date().getTime(), 'yyyy-MM-dd'),
                endTimeCompatible: util.getLocalTime(new Date().getTime(), 'yyyy-MM-dd'),
                teamId: 0,
                projectId: 0,
                taskName: '',
                statusName: '',
                taskList: [],
                isSelectStartDate: false,
                isSelectEndDate: false,
                nowTime: util.getLocalTime(new Date().getTime(), 'yyyy-MM-dd').split('-').join(''),                
                taskId: '',
                start_date: '',
                end_date: '',
                timestr: '',
                today: '',
                export_sign_info: {},
                exportType: '',//导出类型
                typeNumber: 1,
                taskMultipleName: [],
                taskMultipleId: [],
                isSingle: true,
                data: {},

            }
        },
        computed: {
            taskPickerData (){
                return this.taskList.map((o, i, a) => {
                    return o.name
                })
            },
            isValidation () {
                if(this.isSingle){
                    return !!this.start_date && !!this.end_date && !!this.taskName && !!this.exportType
                }else{
                    return !!this.start_date && !!this.end_date && (this.taskMultipleName.length != 0) && !!this.exportType
                }
            },
            statusNumber (){
                return ['全部', '异常'].indexOf(this.statusName)
            },
            minDate: function(){
                return util.getLocalTime(this.timestr - 366 * 24 * 60 * 60 * 1000, 'yyyy-MM-dd')
            }
        },
        vuex: {
            getters: {

            },
            actions: {

            }
        },
        methods: {
            /**
             * 初始化
             * @method init
             * @public
             * @return {Null} void
             */
            init (){
                
                this.$watch('isValidation', (newVal, oldVal) => {
                    if(newVal){
                        // 点亮提交按钮
                    }
                })
                //今天日期
                let date = new Date()
                this.timestr = date.getTime()
                this.today = util.getLocalTime(this.timestr, 'yyyy-MM-dd')

                cache.getCache('KqCacheMessge', (data) => {
                    this.teamId = data ? data.team_id : 94
                    this.projectId = data ? data.project_id : 115
                    this.getTaskList()
                })
                commonPage.getWebViewID((data)=>{
                    cache.setMemoryCache('webViewID',{'webViewID':data})
                })
            },
            /**
             * 选择时间
             * @param  {[String]} label [0代表开始时间，1代表结束时间]
             * @return {[type]}       [description]
             */
            selectStartTime(){
                let start = ''
                if(this.end_date){
                    start = util.getLocalTime(util.getStampFromDate(this.end_date) - 31 * 24 * 60 * 60 * 1000, 'yyyy-MM-dd')
                    if(start <= this.minDate){
                        start = this.minDate
                    }
                }else{
                    start = this.minDate
                }
                console.log("start:"+start)
                KCApiApp.showDatePicker("1990-01-01",  this.today, this.start_date || this.today, (data) => {
                    this.start_date = data.SelectedDate
                }, '导出时间范围不能超过一个月')
                // KCApiApp.showDatePicker("1990-01-01",  this.today, this.end_date || this.today, (data) => {
                //     this.start_date = data.SelectedDate
                // }, '导出时间范围不能超过一个月')



            },
            selectEndTime(){
                let end = ''
                if(this.start_date){
                    end = util.getLocalTime(util.getStampFromDate(this.start_date) + 31 * 24 * 60 * 60 * 1000, 'yyyy-MM-dd')
                    if(end >= this.today){
                        end = this.today
                    }
                }else{
                    end = this.today
                }
                console.log('end:'+end)
                KCApiApp.showDatePicker("1990-01-01", this.today, this.end_date || this.today, (data) => {

                    this.end_date = data.SelectedDate
                }, '导出时间范围不能超过一个月')
                // KCApiApp.showDatePicker("1990-01-01", this.today, end, (data) => {
                //     this.end_date = data.SelectedDate
                // }, '导出时间范围不能超过一个月')

            },
            //点击考勤规则按钮
            selectTask (){
                if(this.exportType == ''){
                    widget.toast('请先选择导出类型')
                    return
                }else if(this.exportType == '打卡明细表'){
                    cache.setMemoryCache('selectTask', this.taskId)
                    let url = `pId=${this.projectId}&tId=${this.teamId}`
                    location.href = "dmsaas://KqRuleSingle?urdData=" + encodeURIComponent(url)
                }else{
                    let selectMultipleTask = {
                        name: this.taskMultipleName,
                        id: this.taskMultipleId
                    }
                    cache.setMemoryCache('selectMultipleTask', selectMultipleTask)
                    let url = `pId=${this.projectId}&tId=${this.teamId}`
                    location.href = "dmsaas://KqRuleMultiple?urdData=" + encodeURIComponent(url)
                }
                // let data = {
                //     data1: this.taskPickerData
                // }
                // // let pos = this.taskName == '' ? '0' : `${this.taskPickerData.indexOf(this.taskName)}`
                // let pos = this.taskName == '' ? '0' : `${this.taskPickerData.indexOf(this.taskName)}`
                // let select = [pos]
                // clientUi.showPicker(data, select, '选择考勤规则', (data) => {
                //     this.taskName = this.taskList[data.data1].name
                //     this.taskId = this.taskList[data.data1].id
                    
                // })
            },
            //导出类型
            selectType (){
                let data = {
                    data1: [
                        '考勤汇总统计',
                        '日汇总统计',
                        '打卡明细表'
                    ]
                }
                let pos = this.exportType == '' ? '0' : `${data.data1.indexOf(this.exportType)}`
                let select = [pos]
                clientUi.showPicker(data, select, '选择导出类型', (res) => {
                    if(res.data1){                        
                        this.exportType = data.data1[res.data1]
                        this.typeNumber = parseInt(res.data1)+1
                        if(this.typeNumber == 3){
                            this.taskMultipleName = []
                            this.taskMultipleId = []
                            this.isSingle = true
                        }else if(this.typeNumber == 1 || this.typeNumber == 2){
                            this.taskName = ''
                            this.taskId = ''
                            this.isSingle = false
                        }
                    }                    
                })
            },
            // 点击导出按钮
            exportFn (){
                if(!this.exportType){
                    widget.toast('请选择导出类型')
                    return
                }
                if(!this.start_date || !this.end_date){
                    widget.toast('请选择导出区间')
                    return
                }
                if(util.getStampFromDate(this.end_date) < util.getStampFromDate(this.start_date)){
                    widget.toast('结束时间不得小于开始时间')
                    return
                }
                if((util.getStampFromDate(this.end_date) - util.getStampFromDate(this.start_date)) > (31 * 24 * 60 * 60 * 1000)){
                     widget.toast('导出时间范围不能超过一个月')
                     return
                }
                if(!this.taskName && (this.taskMultipleName.length == 0)){
                    widget.toast('请选择考勤规则')
                    return
                }
                if(this.isSingle){        
                    let taskId = []
                    this.taskList.some((o, i, a) => {
                        if(o.id == this.taskId){
                            taskId[0] = o.id
                            return true
                        }
                    })
                    this.data = {
                        team_id: this.teamId,
                        project_id: this.projectId,
                        start_date: this.start_date,
                        end_date: this.end_date,
                        task_id: taskId,
                        type: this.typeNumber
                    }
                }else{
                    this.data = {
                        team_id: this.teamId,
                        project_id: this.projectId,
                        start_date: this.start_date,
                        end_date: this.end_date,
                        task_id: this.taskMultipleId,
                        type: this.typeNumber
                    }
                }
                
                if(this.isValidation){
                    socialApi.exportDataFileAndShare(1, this.data)
                }
            },
            // 获取考勤任务列表
            getTaskList (){
                commonPage.loadPageStatus('loading')
                util.ajax({
                    url: '/attendance/attendance_task_names',
                    data: {
                        team_id: this.teamId,
                        project_id: this.projectId,
                        page_size: 10000
                    },
                    success: (res) => {
                        console.log("考勤任务列表"+JSON.stringify(res))
                        if(res.errno == 0){                            
                            // 请求数据成功
                            this.taskList = res.data
                            this.taskList.forEach((obj) => {
                                if(obj.status == 2){
                                    obj.name = obj.name + '(已删除)'
                                }else{
                                    obj.name = obj.name
                                }
                            })
                            
                        }else{
                            widget.toast('服务器异常')
                        }
                        
                        commonPage.loadPageStatus('loadSuccess')
                    },
                    error: (xhr, error) => {
                        widget.toast('服务器异常')
                        commonPage.loadPageStatus('loadSuccess')
                    },
                    noNetwork: () => {
                        // 无网络的回调
                        widget.toast('网络连接失败，请检查网络')
                    }
                })
            },
            //更新考勤规则
            updateData (data){
                if(!data)return//兼容ios无操作返回时会触发loadData  并返回 0
                let key = data.key
                let value = data.value
                switch(key){
                    case 'selectTask':
                        this.taskName = value.name
                        this.taskId = value.id
                        this.isSingle = true
                        break
                    case 'selectMultipleTask':
                        this.taskMultipleName = data.name
                        this.taskMultipleId = data.value
                        this.isSingle = false
                        break
                    default:
                    return
                }
                
            }
        },
        created(){
            window.loadData = this.updateData
            this.init()
            
        }
        
    }

    
</script>

<!-- CSS 样式 -->
<!-- <style src="static/css/global.css"></style> -->
<style src="../../node_modules/weui/dist/style/weui.css"></style>
<style src="../../static/css/common.css"></style>
<style src="../../static/css/attendance.css"></style>


